<template>
	<view class=" shop-car">
		<view v-if="token">
			<commonCar ref="car" :list="goodsProducts" @delect="delect" @accounts="accounts">
			</commonCar> 
		</view>
		<view v-else class="login-box">
			<text class="color-0 fs-28" @click="goLogin">您还未登录，请先登录</text>
			<view class='btn bg-43 border-radio-14 color-white' @click="goLogin">去登录</view>
		</view>
		<u-modal :show="show"  title="删除提醒" :showCancelButton='true' @cancel='show = false' @confirm='confirm'>
			<view class="slot-content ">
				是否删除选中的商品
			</view>
		</u-modal>
	</view>
</template>

<script>
	import commonCar from '@/components/shopCar/shopCar.vue'
    import { getCartList} from '@/api/home.js'
	export default {
		data() {
			return {
				show:false,
				goodsProducts: [
					{goods:[]}
				],
				token :''
			}
		},
		components: {
			commonCar
		},
        onShow(){
			let token = uni.getStorageSync('token')
			this.token  = token
			console.log(token);
            this.getCartList()
			this.$nextTick(() => {
				// 确保在这里访问 $refs 是安全的
				const myRef = this.$refs.car;
				if (myRef &&token) {
					this.$refs.car.getInit()
				}
			});
        },
		methods: {
            getCartList(){
               
            },
			delect(e){
				this.show = true
			},
			accounts(e){
				console.log(e);
			},
			confirm(){},
			goLogin(){
				uni.navigateTo({
					url:'/pages/login/login'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.shop-car {
		width: 750rpx;
		min-height: 100vh;
		display: flex;
		flex-direction: column;
		justify-content: center;
		background: #F5F5F5;
	}
	.slot-content {
		text-align: center;
		font-size: 28rpx;color: #707070;
	}
	.login-box {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%; 
		padding-top: 300rpx;
		.btn {
			margin-top: 40rpx;
			width: 240rpx;
			height: 80rpx;
			text-align: center;
			line-height:  80rpx;
		}
	}
</style>
